import 'package:flutter/material.dart';

class BottomNavigationDemo extends StatefulWidget {
  @override
  _BottomNavigationDemoState createState() => _BottomNavigationDemoState();
}

class _BottomNavigationDemoState extends State<BottomNavigationDemo> {
  int _currentIndex = 0;

  // 页面列表
  final List<Widget> _pages = [
    HomeScreen(),
    SearchScreen(),
    FavoritesScreen(),
    ProfileScreen(),
  ];

  // 底部导航项
  final List<BottomNavigationBarItem> _bottomItems = [
    BottomNavigationBarItem(
      icon: Icon(Icons.home),
      label: '首页',
    ),
    BottomNavigationBarItem(
      icon: Icon(Icons.search),
      label: '搜索',
    ),
    BottomNavigationBarItem(
      icon: Icon(Icons.favorite),
      label: '收藏',
    ),
    BottomNavigationBarItem(
      icon: Icon(Icons.person),
      label: '我的',
    ),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(_getAppBarTitle()),
        backgroundColor: _getAppBarColor(),
      ),
      body: _pages[_currentIndex],
      bottomNavigationBar: BottomNavigationBar(
        type: BottomNavigationBarType.fixed, // 固定模式
        currentIndex: _currentIndex,
        onTap: (index) {
          setState(() {
            _currentIndex = index;
          });
        },
        items: _bottomItems,
        selectedItemColor: Colors.blue,
        unselectedItemColor: Colors.grey,
      ),
    );
  }

  // 根据当前页面获取 AppBar 标题
  String _getAppBarTitle() {
    switch (_currentIndex) {
      case 0:
        return '首页';
      case 1:
        return '搜索';
      case 2:
        return '收藏';
      case 3:
        return '个人中心';
      default:
        return '应用';
    }
  }

  // 根据当前页面获取 AppBar 颜色
  Color _getAppBarColor() {
    switch (_currentIndex) {
      case 0:
        return Colors.blue;
      case 1:
        return Colors.orange;
      case 2:
        return Colors.pink;
      case 3:
        return Colors.purple;
      default:
        return Colors.blue;
    }
  }
}

// 首页屏幕
class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: Column(
        children: [
          Container(
            height: 200,
            width: double.infinity,
            color: Colors.blue.withOpacity(0.2),
            child: Center(
              child: Text(
                '欢迎来到首页',
                style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
              ),
            ),
          ),
          SizedBox(height: 20),
          Padding(
            padding: EdgeInsets.all(16),
            child: Text(
              '这是首页内容',
              style: TextStyle(fontSize: 18),
            ),
          ),
          _buildCard('最新消息', Icons.message, Colors.blue),
          _buildCard('热门推荐', Icons.trending_up, Colors.orange),
          _buildCard('特别优惠', Icons.local_offer, Colors.green),
        ],
      ),
    );
  }

  Widget _buildCard(String title, IconData icon, Color color) {
    return Card(
      margin: EdgeInsets.all(10),
      child: ListTile(
        leading: Icon(icon, color: color, size: 30),
        title: Text(title),
        trailing: Icon(Icons.arrow_forward_ios),
        onTap: () {
          print('点击了 $title');
        },
      ),
    );
  }
}

// 搜索屏幕
class SearchScreen extends StatefulWidget {
  @override
  _SearchScreenState createState() => _SearchScreenState();
}

class _SearchScreenState extends State<SearchScreen> {
  final TextEditingController _controller = TextEditingController();
  List<String> _searchResults = [];

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.all(16),
      child: Column(
        children: [
          TextField(
            controller: _controller,
            decoration: InputDecoration(
              hintText: '请输入搜索内容',
              prefixIcon: Icon(Icons.search),
              border: OutlineInputBorder(
                borderRadius: BorderRadius.circular(10),
              ),
            ),
            onSubmitted: (value) {
              _performSearch(value);
            },
          ),
          SizedBox(height: 20),
          ElevatedButton(
            onPressed: () {
              _performSearch(_controller.text);
            },
            child: Text('搜索'),
          ),
          SizedBox(height: 20),
          Expanded(
            child: _searchResults.isEmpty
                ? Center(
                    child: Text(
                      '请输入关键词进行搜索',
                      style: TextStyle(fontSize: 16, color: Colors.grey),
                    ),
                  )
                : ListView.builder(
                    itemCount: _searchResults.length,
                    itemBuilder: (context, index) {
                      return ListTile(
                        title: Text(_searchResults[index]),
                        leading: Icon(Icons.search),
                      );
                    },
                  ),
          ),
        ],
      ),
    );
  }

  void _performSearch(String query) {
    if (query.isNotEmpty) {
      setState(() {
        _searchResults = List.generate(
          10,
          (index) => '搜索结果 $index: $query 相关内容',
        );
      });
    }
  }
}

// 收藏屏幕
class FavoritesScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.all(16),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '我的收藏',
            style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
          ),
          SizedBox(height: 20),
          Expanded(
            child: GridView.builder(
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: 2,
                crossAxisSpacing: 10,
                mainAxisSpacing: 10,
              ),
              itemCount: 8,
              itemBuilder: (context, index) {
                return Card(
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Icon(
                        index % 2 == 0 ? Icons.favorite : Icons.bookmark,
                        size: 40,
                        color: Colors.pink,
                      ),
                      SizedBox(height: 10),
                      Text('收藏项目 $index'),
                    ],
                  ),
                );
              },
            ),
          ),
        ],
      ),
    );
  }
}

// 个人中心屏幕
class ProfileScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: Column(
        children: [
          Container(
            height: 150,
            width: double.infinity,
            color: Colors.purple.withOpacity(0.2),
            child: Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  CircleAvatar(
                    radius: 40,
                    backgroundColor: Colors.purple,
                    child: Icon(
                      Icons.person,
                      size: 40,
                      color: Colors.white,
                    ),
                  ),
                  SizedBox(height: 10),
                  Text(
                    '用户名',
                    style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
                  ),
                ],
              ),
            ),
          ),
          SizedBox(height: 20),
          _buildProfileItem(Icons.account_circle, '个人资料'),
          _buildProfileItem(Icons.settings, '设置'),
          _buildProfileItem(Icons.help, '帮助与反馈'),
          _buildProfileItem(Icons.info, '关于我们'),
          _buildProfileItem(Icons.exit_to_app, '退出登录'),
        ],
      ),
    );
  }

  Widget _buildProfileItem(IconData icon, String title) {
    return Card(
      margin: EdgeInsets.symmetric(horizontal: 16, vertical: 4),
      child: ListTile(
        leading: Icon(icon, size: 30),
        title: Text(title),
        trailing: Icon(Icons.arrow_forward_ios),
        onTap: () {
          print('点击了 $title');
        },
      ),
    );
  }
}

// 使用示例
void main() {
  runApp(MaterialApp(
    home: BottomNavigationDemo(),
    debugShowCheckedModeBanner: false,
  ));
}
